<template>
	<view class="container">
		<top-back-navbar position="fixed" title="提现" background="" color="#fff"></top-back-navbar>
		<cxsytabbars :current="2"></cxsytabbars>
		<view class="hander">
			<view class="hander_img">
				<view class="" class="conent_box">
					<view class="" style="font-size: 15px;margin-bottom: 5px;text-align: center;">
						我的收益
					</view>
					<view class="" style="display: flex;align-items: center;text-align: center;">
						<p style="margin-top: 12px;">￥</p>
						<p style="font-size: 31px;">{{shouyi}}</p>
					</view>
				</view>
			</view>
		</view>
		<view class="tx_box">
			<view class="tx_box_border">
				<view class="yhk">
					银行卡提现
				</view>
				<view class="">

					<checkbox-group @change="yesorno">
						<checkbox value="cb" color="#fff" style="transform:scale(0.7)" checked="true" />
					</checkbox-group>


				</view>
				<view class="">
					<view class="gou_mxb"  @click="to_nextpage('/pagesZA/qianbao/mingxi?type=za_shouyi&r=api.index.get_za_mingxi_list&title=收益明细&hander=我的收益')">
						明细表
					</view>
				</view>
			</view>
		</view>
		<view class="move_box">
			<view class="move_box">
				<view class="item" @click="tixian_touchend">
					<view class="tixian">
						
					</view>
					点击立即提现
				</view>
			</view>
			
		</view>
	</view>

</template>

<script>
	export default {
		data() {
			return {
				nonBreakingSpace: '\u00A0\u00A0\u00A0',
				tixian_x: 0,
				tixian_y: 0,
				openid:0,
				shouyi:0,
				n: true,
				txi:0
			};
		},
		onLoad: function(e) {
			console.log(e.shouyi);
			this.shouyi=e.shouyi
			var _this = this
			var id = uni.getStorage({
				key: 'openid',
				success: function(res) {
					var id = res.data
					
					_this.openid = id
					_this.get_data()
				},
				fail: function(err) {
					uni.hideLoading()
					uni.navigateTo({
						url: '/pages/login/login'
					});
				}
			});
			
			
			this.tixian_x = 0
			this.tixian_y = 0
			this.n=false
		},
		methods: {
			to_nextpage(path){
				console.log(path);
				uni.navigateTo({
					url: path
				});
			},
			yesorno(e) {
				console.log(e.detail);
			},
			tixian_onChange(e) {

				this.tixian_x = e.detail.x
				this.tixian_y = e.detail.y


			},
			tixian_touchend() {
			
					uni.navigateTo({
						url: '/pages/member/details/tx/tx?type=4'
					});
				
			},
			get_data() {
				var openid = this.openid
				
			},
			get_openid(id) {
				this.openid = id
			},
		}
	}
</script>

<style lang="scss">
	page {
		height: 100%;
	}
	.uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked{
		color: #000 !important;
		    background: #fff !important;
		    border-color: #fff !important;
		
	}

	.container {

		height: 100vh;
		background: url('/static/images/home/za_qianbao_bg.png') 0 0 no-repeat;
		// background-size: 150% 106%;
		position: relative;
		padding: 15px 10px 104px;
	}

	.hander_img {
		background: url('/static/images/home/za_cd_zong.png') 0 0 no-repeat;
		width: 100%;
		height: 156px;
		background-size: 100% 166px;
		box-sizing: border-box;
		padding: 57px 15px 0;
		display: flex;
		justify-content: center;

		.conent_box {
			color: #fff;
		}
	}

	.tx_box {
		padding: 10px 13px;

		.tx_box_border {
			width: 100%;
			color: #fff;
			background-color: #04477f;
			border-radius: 5px;
			padding: 20px 20px;
			display: flex;
			justify-content: space-around;

			.yhk {
				width: 130px;
				height: 31px;
				border-bottom: 1px solid #91afc8;
				padding: 0 15px;
				box-sizing: border-box;
				text-align: center;
			}

			.gou_mxb {
				margin-left: 5px;
				width: 88px;
				height: 26px;
				background: linear-gradient(180deg, #1beffe, #0883e8);
				border-radius: 26px;
				text-align: center;
			}

			.uni-checkbox-input-checked {
				background-color: #fff !important;
			}
		}

	}

	.move_box {

		display: flex;
		justify-content: center;
		margin-top: 25px;
		width: 100%;
		movable-area {
			height: 49px;
			width: 170px;
			background-color: #F0F0F0;
			overflow: hidden;
			border-radius: 50px;
			text-align: right;
			line-height: 49px;
		}
		.item{
			width: 40%;
			height: 40px;
			line-height: 40px;
			// border: 1px solid red;
			background-color: #F9F9F9;
			border-radius: 50px;
			color: #A1A1A1;
			position: relative;
			text-align: end;
			padding-right: 20rpx;
			}
		.tixian {
			width: 40px;
			height: 40px;
			background: url('/static/images/home/za_tixian.png') 0 0 repeat;
			background-size: 100% 100%;
			position: absolute;
			left: 0;
		}

		.fenhong {
			width: 49px;
			height: 49px;
			background: url('/static/images/home/za_zhuanfenhong.png') 0 0 repeat;
			background-size: 100% 100%;
		}

		movable-view {
			display: flex;
			align-items: center;
			justify-content: center;
			height: 150rpx;
			width: 150rpx;
			background-color: #007AFF;
			color: #fff;
		}
	}
</style>